"use client";
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
import { User2Icon } from "lucide-react";
import { cn, image } from "@/lib/utils";
import * as AvatarPrimitive from "@radix-ui/react-avatar";
import { ComponentProps } from "react";
import { useSession } from "next-auth/react";

interface UserAvatarProps extends ComponentProps<typeof AvatarPrimitive.Root> {
  defaultIconSize?: string;
}

export default function UserAvatar({
  defaultIconSize = "h-4 w-4",
  className,
  ...props
}: UserAvatarProps) {
  const { data: session } = useSession();
  return (
    <Avatar className={className} {...props}>
      <AvatarImage
        className="object-cover"
        src={image(session?.user.image ?? "")}
      />
      <AvatarFallback>
        <User2Icon className={cn("text-primary", defaultIconSize)} />
      </AvatarFallback>
    </Avatar>
  );
}
